<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
		#content{
			width: 100%;
			border: #000000 solid 1px;
			display: flex;
			justify-content: center;
		}
			#userinfo{
				background: #aaff7f;
				display: flex;
				flex-direction: column;
				
				align-items: center;
				left: 300px;
				width: 200px;
				height: 300px;
				padding: 10px 10px 10px 10px;
				border: #000000 dashed 1px;
			}
			#btn{
				width: 30%;
			}
		</style>
	</head>
	<body>
		<div id="content">
			<div id="userinfo">
			<input type="text" name="" id="user" value="" placeholder="用户名" />
			<input type="test" name="" id="email" value=""  placeholder="邮箱"/>
			<input type="button" name="" id="btn" value="提交" onclick="getInfo()"/>
		</div>
		<ul id="view">
			
		</ul>
		</div>
		<script type="text/javascript">
			
		</script>
		<script type="text/javascript" src="../static/js/jquery-3.6.0.min.js">
			function getInfo(){
				var user=$('#user').val()
				var email=$('#email').val()
				var newli=$('<li>').text(user)
				$('#view').append(newli)
			}
		</script>
	</body>
</html>
